<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>周传勇的个人网站</title>
    <meta name="author" content="周传勇" />
    <link rel="icon" href="static/img/13.jpeg" sizes="192x192" />
    <link href="static/kico.css" rel="stylesheet" type="text/css" />
    <link href="paul.css" rel="stylesheet" type="text/css" />
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

</head>

<body>
    <aside class="sidebar">
        <div class="avatar">
            <img src="static/img/20.png" title="周传勇" />
        </div>

        <section class="buttons">
            <nav class="container_odd">
                <div class="set_container">
                    <a href="#info" class="set_1_btn Vbtn-1"> <svg>
            <rect x="0" y="0" fill="none" width="100%" height="100%"></rect>
            </svg>资料</a>
                </div>
                <section class="buttons">
                    <nav class="container_odd">
                        <div class="set_container">
                            <a href="#skills" class="set_1_btn Vbtn-1"> <svg>
            <rect x="0" y="0" fill="none" width="100%" height="100%"></rect>
            </svg>技能</a>
                        </div>
                        <section class="buttons">
                            <nav class="container_odd">
                                <div class="set_container">
                                    <a href="#works" class="set_1_btn Vbtn-1"> <svg>
            <rect x="0" y="0" fill="none" width="100%" height="100%"></rect>
            </svg>作品</a>
                                </div>
                                <section class="buttons">

                                    <nav class="container_odd">
                                        <div class="set_container">
                                            <a href="#story" class="set_1_btn Vbtn-1"> <svg>
            <rect x="0" y="0" fill="none" width="100%" height="100%"></rect>
            </svg>个人</a>
                                        </div>
                                    </nav>
                                    <section class="buttons">

                                        <nav class="container_odd">
                                            <div class="set_container">
                                                <a href="#team" class="set_1_btn Vbtn-1"> <svg>
            <rect x="0" y="0" fill="none" width="100%" height="100%"></rect>
            </svg>团队</a>
                                            </div>
                                            <div class="spinner">
                                                <div class="rect1"></div>
                                                <div class="rect2"></div>
                                                <div class="rect3"></div>
                                                <div class="rect4"></div>
                                            </div>
                                        </nav>
    </aside>
    <main>
        <section id="info">
            <div class="wrap">
                <button> <h2 class="title">个人资料</h2></button>
                <div class="row">
                    <div class="col-l-4">
                        <span>姓名：周传勇</span>
                        <p></p>
                        <span>性别：男</span>
                        <p></p>
                        <span>年龄：19</span>
                        <p></p>
                        <span>学校：成都东软学院</span>
                    </div>
                    <div class="col-l-4">
                        <span>QQ：1589227139</span>
                        <p></p>
                        <span>微信：17628677716</span>
                        <p></p>
                        <span>学校：成都东软学院</span>
                        <p></p>
                        <span>邮箱：<a href="https://mail.qq.com/">1589227139@qq.com</a></span>
                    </div>
                    <div class="col-l-4">
                        <span>我叫周传勇，是一名普普通通的在校大学生就<br>读成都东软 学院，艺术与科技专业，有4年绘画经验，性格开朗，胸中怀有大志，虽然能力有限，但<br>会尽力做好，将快乐带给身边的人，开心幸福每一天</span>
                        <img src="static/img/14.jpg" width="500px" height="50px">
                    </div>
                </div>
            </div>
        </section>
        <section id="skills">
            <div class="wrap">
                <h2 class="title">掌握的技能</h2>
                <div class="row scrollable">
                    <div class="col-s-6 col-m-4 center-fixed">
                        <div class="skills-icon">
                            <i class="fa fa-html5"></i>
                            <div class="load-container">
                                <div class="loader-bounce"></div>
                            </div>
                            <div class="load-container1">
                                <div class="loader-bounce1"></div>
                            </div>
                        </div>
                        <div class="skills-title">
                            <h3>HTML </h3>
                            <p>简单的html操作和网页</p>
                        </div>
                    </div>
                    <div class="col-s-6 col-m-4 center-fixed">
                        <div class="skills-icon">
                            <i class="fa fa-css3"></i>
                        </div>
                        <div class="skills-title">
                            <h3>PS AI</h3>
                            <p>熟练使用PS AI</p>
                        </div>
                    </div>
                    <div class="col-s-6 col-m-4 center-fixed">
                        <div class="skills-icon">
                            <i class="fa fa-code"></i>
                        </div>
                        <div class="skills-title">
                            <h3>绘画</h3>
                            <p>使用绘画工具进行绘画</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section id="works">
            <div class="wrap">
                <button><h2 class="title">个人作品</h2></button>
                <div class="row">
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/1.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/2.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/3.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/4.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/5.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/6.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/7.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/8.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/9.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                    <div class="col-s-6">
                        <div class="works-item">
                            <img src="static/img/works/10.jpg" width="400px" />
                            <p></p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section id="story">
            <div class="wrap">
                <button><h2 class="title">个人</h2></button>
                <div class="row">
                    <div class="col-m-8">
                        <ul class="timeline">
                            <span class="one">我本人比较喜欢外出游玩也比较喜欢听歌资深网易云用户，对于运动则是能不运动就不运动也喜欢宅家里打游戏或者 做作业，但是踏进大学后，我就要求自己，立志要在大学生涯中有所成就，从全方面发展自己。我也是一个追求完美的人，我知道世没有十全十美的人存在,但我们可以去追求，去不断的向它靠拢，每个人或多或少都有缺点，我把这些缺点比作一个无形的洞，我们都知道洞是可以填补的，就好比缺点也是可以改正的，这也就要我们怎样把这个洞一点一点填上，就是怎样一点一点完善自己。洞是无形的，就如人不会是十全十美，我们或许永远填不满这洞，就好像人不会十全十美,也就正如学习，学习是无止境的。因此我要不断的填洞，不断的学习不断的完善自己努力就一定会成功优秀的人很多只做好自己</span>
                        </ul>
                    </div>
                    <div class="col-m-4 center-fixed">
                        <img src="static/img/12.jpg" width="300px" />
                    </div>
                </div>
            </div>
        </section>
        <section class="content-d" id="team">
            <div class="wrap">
                <button><h2 class="title">我的团队</h2></button>
                <div class="row">
                    <div class="col-m-6">
                        <span>我的团队由我的两位室<br>友【汤福懿，钟尚杰】<br>和一位朋友【吕冬妹】<br>组成，虽然大家来自不<br>同的地方，但都在齐心<br>协力共同做事情，下面<br>是我们团队的网址，详<br>细请点击<br> 团队官网：
                               <a href="#">叙利亚暴徒</a></span>

                        <div class="loader">
                            <div class="outer"></div>
                            <div class="middle"></div>
                            <div class="inner"></div>
                        </div>
                        </p>
                    </div>
                    <div class="col-m-6 center">
                        <img src="static/img/11.jpg" width="300px" />
                    </div>
                </div>
            </div>
        </section>

        <footer>
            <p>周传勇<a href="https://mail.qq.com/cgi-bin/frame_html?sid=BYa5uxVHKpNcRRtE&r=f4af629cdde99ac4b1b73e9990072c38" title="周传勇" target="_blank">__1589227139@qq.com</a>.</p>
        </footer>
    </main>
    <script src="static/kico.js"></script>
    <script src="static/paul.js"></script>

</body>


</html>